import vue from '@vitejs/plugin-vue'
import vike from 'vike/plugin'
import { UserConfig } from 'vite'
import { viteCommonjs } from '@originjs/vite-plugin-commonjs'
import Components from 'unplugin-vue-components/vite';
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers';
import { cjsInterop } from "vite-plugin-cjs-interop";
import resolve from '@rollup/plugin-node-resolve';
import path from 'path'
const config: UserConfig = {
  resolve: {
    alias: {
      '@':path.resolve(__dirname, './'),
      '#root':path.resolve(__dirname, './'),
      '~assets': path.resolve(__dirname, './assets/'),
    },
    extensions: ['.ts', '.js', '.json', '.vue']
  },
  css: {
    preprocessorOptions: {
      scss: {
        // additionalData: `@import "@/styles/variables.scss";` //全局自动引入变量
        additionalData: `@import '@/styles/handle.scss';@import '@/styles/common.scss';`
      }
    }
  },
  server: {
    host: '0.0.0.0',
    port: 8091,
  },
  optimizeDeps: { include: ['axios','lodash'] }, // 预加载的依赖, 减少首屏加载时间
  plugins: [
    vike({ prerender: true }),
    vue({
      include: [/\.vue$/, /\.md$/],
    }),
    viteCommonjs({
      // exclude: ['.ts', '.js'],
    }),
    cjsInterop({
      dependencies: [
        "splitpanes",
        "splitpanes/**",
        "lodash"
      ]
    }),
    resolve({
      preferBuiltins: true,
      extensions: ['.ts', '.js', '.json', '.vue'],
    }),
    Components({
      resolvers: [
        AntDesignVueResolver({
          importStyle: false, // css in js
          resolveIcons:true,/* 引入图标 */
        }),
      ],
    })
  ],
  ssr:{
    // 添加有问题的包
    noExternal: ['splitpanes','lodash',"codemirror","vue-codemirror"]
  },
  build: {
    outDir: 'dist',
    cssCodeSplit: true
    // rollupOptions:{
    //   output:{
    //     manualChunks: {
    //       // 'lodash': ['lodash'],
    //     },
    //   }
    // }
  },
}

export default config
